“Visual Composer - Social Stream Post Type Grid and Carousel” Documentation by “Hitesh Khunt” v1.1

“Visual Composer - Social Stream Post Type Grid and Carousel”

Created: 23/06/2017
By: Hitesh Khunt
Email: khunthitesh32@gmail.com

Thank you for purchasing my wordpress plugin. If you have any questions that are beyond the scope of this help file, please feel free to email via my user page contact form here. Thanks so much!

Introduction
Main Features
Installation guide
Getting started
Sources and Credits

A) Introduction - top

Visual Composer - Social Stream Post Type Grid and Carousel give you an incredible flexibility to insert whatever you want in social and pages body. social Post available for specify social feed display in your website. you can create custom social grid and carousel individual social feed. 1 to 5 columns option available for Desktop, Tablet and Mobile.

Everyone can use , because it’s fully automatic, and it’s compatible with all recent versions of wordpress!

B) Main Features - top

Responsive Design Layouts.
4 Style Available
Inline Social read popup
Inline Only image popup
Social carousel
Custom Columns Layout
Custom backgrond Color and hover background color
Fitrow and Masonry Grid Layout
Show more and Infinite Scroll and Number Pagination
Multi Filtering
Social Share icon for each post in popup
social post type available for add selected social post
60+ animation effects

C) Installation guide - top

This part of the documentation is going to cover, in a step by step instruction the installation of WP Plugins on your WordPress blog in general.

Step 1. The most important task is to make certain you have an upto date backup of your blog! This is always a good thing, not necessarily so important for our plugin but in general.
Step 2. Log into your WordPress Admin area.
Step 3. Look down the left hand column for "Plugins" and then click on the word "Plugins".
Step 4. Just to the right of the title “(Manage) Plugins” in the image above, you can see a button marked "Add New", click this button.

Plugin Upload

Step 5. The image above shows the option to upload the plugin from your own PC, this is the vc-social-grid.zip inside the zip you had previously downloaded from CodeCanyon. Install the zip and click on "Activate Plugin".

Plugin activation

Installibg by FTP

First, you need a tool for uploading plugin files to your site, you can use filemanager from cPanel or any FTP clients. Some good FTP clients :

Download vc-social-grid.zip from CodeCanyon
Extract the vc-social-grid directory to your computer
Upload the vc-social-grid directory to the /wp-content/plugins/ directory
Activate the plugin in the Plugin dashboard

Also WordPress codex contains instructions on how to do this here.

Visual Composer is a basic drag and drop page builder plugin and a modeling tool that enables code-free composition of UI elements, Enterprise Services, and reusable components to rapidly create and adapt rich user interfaces on your WordPress website.

To start using Visual Composer, follow these simple steps:

Add a new page/post or edit the existing one.
Observe the Visual Composer button to start designing custom pages from their Frontend/Backend/Classic editor. Screenshot
The Visual Composer Backend Editor page will look something like this
Click "Add Element" to start using the elements directly or click "Add row" to define your grid structure.

Using the newly Added feature of Frontend Editor:

Visual Composer’s version 4.0 and above have a new feature of Frontend editor.
Easy to use.
Click on the edit button against the specific element to edit its properties.

If you click "Add Element" in Visual Composer a jQuery popup box will appear.
Click on "Social Gred and Carousel" which is a dedicated tab for our plugin. A list of all the elements that our plugin provides will appear.
Select the element that you want to use.

Social Media Content Settings. - top

Here are the following supported Social Post formats:

Facebook
Youtube
Vimeo
Dribbble
Quote
Twitter
Instagram
Pinterest

These format are supported in all skins.

D) Getting started - top

The simple activation of the plugin is enough to have the desired behavior for all pages.

General Settings

Setting Title	Description	Default	Possible Values
Title	Enter Social grid title.
Social Grid type	Choose svc type.	Post Layout
Build Social Post Query	Create WordPress loop, to populate content from your site.
Select Social Data	Select social data for front side display..	All checked	Facebook,Twitter,Pinterest,Vimeo,Youtube,Quote,Dribbble,Instagram
Skin type	Choose skin type for grid layout.
Items Display	This variable allows you to set the maximum amount of items displayed at a time with the widest browser width.(Only for Social Grid type = carousel)	4
Show pagination	Show pagination(Only for svc type = carousel)	unchecked	Yes(checked)
Show pagination Numbers	Show numbers inside pagination buttons.(Only for svc type = carousel)	unchecked	Yes(checked)
Hide navigation	Display "next" and "prev" buttons.(Only for svc type = carousel)	unchecked	Yes(checked)
AutoPlay	Set Slider Autoplay.(Only for svc type = carousel)	unchecked	Yes(checked)
AutoPlay Time(Visible only autoplay "yes")	Set Autoplay slider speed.(Only for svc type = carousel)	5
Desktop Columns Count	Choose Desktop(PC Mode) Columns Count.(not allow for style6)	3 Columns
Tablet Columns Count	Choose Tablet Columns Count.(not allow for style6)	2 Columns
Mobile Columns Count	Choose Mobile Columns Count.(not allow for style6)	1 Columns
Show filter	Select to add animated category filter to your posts grid.	unchecked	Yes(checked)
Layout mode	Select layout template.	Fit Row
Pagination Style	Select Pagination Style	Show more
Hide Show more Button	hide Show more button.this option only for Show more pagination.	unchecked	Yes(checked)
Post load Effect	Select post load effect.	None
Viewport Loading	Viewport Loading is Scroll wise loading feed.	unchecked	Yes(checked)
Show more text	add Show more button text.Default:Show More		Enter any text
Extra class name	If you wish to style particular content element differently, then use this field to add a class name and then refer to it in your css file.		Add any class name for custom css

Display Settings

Setting Title	Description	Default	Possible Values
Hide Excerpt	hide Excerpt content. Twitter and Blockquote content not hide.	unchecked	Yes(checked)
Excerpt Length	set excerpt length.default:20	20
Hide Date	hide Date.	unchecked	Yes(checked)
Hide Username and User Image	Hide Username and User Image	unchecked	Yes(checked)
Hide YouTube and Vimeo Title	Hide YouTube and Vimeo Title.	unchecked	Yes(checked)

Color Settings

Setting Title	Description	Possible Values
Post Background Color	set each post background color.	any color select on color picker
Title Color/Font Size for Youtube and Vimeo	Set Title Color/Font Size for Youtube and Vimeo. Default font size : 18px.	any color select on color picker
Description Color/Font size	Set Description Color/Font size. Default font size : 14px.	any color select on color picker
Twitter and Blockquote Font size	Set Twitter and Blockquote Font size. Default font size : 19px.	any color select on color picker
Description Link and User Link Color	Set Description Link and User Link Color.	any color select on color picker
Image Hover Overlay Background Color	Set Image Hover Overlay Background Color.	any color select on color picker
Show More Color	Set Show More Color	any color select on color picker
Filter text and border color	Set Filter text and border color	any color select on color picker
Active Filter text color	Set Active Filter text color	any color select on color picker
Active Filter text background color	Set Active Filter text background color	any color select on color picker
Pagination background color	set Pagination background color.	any color select on color picker
Pagination active background color	set Pagination active background color.	any color select on color picker
Pagination Number color	set Pagination Number color.	any color select on color picker
Navigation and Pagination color	Set Navigation and pagination color.(Only for svc type = carousel)	any color select on color picker

General Option Settings

Setting Title	Description	Default	Possible Values
Popup Style	set popup type.

E) Sources and Credits - top

I've used the following css files as listed.

Once again, thank you so much for purchasing this wordpress plugin. As I said at the beginning, I'd be glad to help you if you have any questions relating to this plugin. No guarantees, but I'll do my best to assist. If you have a more general question relating to the plugin on codecanyon, you might consider visiting the forums and asking your question in the "support" section.

Hitesh Khunt

Go To Table of Contents